﻿<!DOCTYPE html>
<html>
<head>
  <title>Todo</title>
  <link rel="stylesheet" type="text/css" href="/Assets/Todo.css" />
</head>
<body>
  <section id="todoapp">
    <header id="header">
      <h1>todos</h1>
      <input id="new-todo" placeholder="What needs to be done?" autofocus>
    </header>
    <section id="main">
      <ul id="todo-list"></ul>
    </section>
    <footer id="footer">
      <span id="todo-count"></span>
      <button id="clear-completed">Clear completed</button>
    </footer>
  </section>
  <footer id="info">
    <p>Script# TODO List Sample (based on TodoMVC)</p>
  </footer>

  <script id="itemTemplate" type="text/html">
    <li {{if completed}}class="completed"{{/if}} data-id="${id}">
      <div class="view">
        <input class="toggle" type="checkbox" {{if completed}}checked{{/if}}>
        <label>${title}</label>
        <button class="destroy"></button>
      </div>
      <input class="edit" value="${title}">
    </li>
  </script>

  <script src="/Scripts/jQuery.min.js"></script>
  <script src="/Scripts/jQuery.tmpl.js"></script>
  <script src="/Scripts/mscorlib.js"></script>
  <script src="/Scripts/Todo.debug.js"></script>
</body>
</html>
